import React, { memo } from 'react';
import './index.less';
import { Button, Tag } from 'antd';
import { createFromIconfontCN } from '@ant-design/icons';

export default memo(function Index() {
  // 阿里巴巴矢量库图标
  const MyIcon = createFromIconfontCN({
    scriptUrl: '//at.alicdn.com/t/c/font_3951118_136ba3rr27u.js', // 在 iconfont.cn 上生成
  });
  const Wchange = (e) => {
    // 标签切换
    console.log(e, '11111');
  };
  return (
    <div className="answers">
      <div className="an_left">
        <h1 className="an_title">问答</h1>
        <div
          className="an-tabs"
          onClick={(e) => {
            Wchange(e);
          }}
        >
          <span>最新</span>
          <span>待回答</span>
          <span>周榜</span>
          <span>月榜</span>
          <span>
            <MyIcon
              style={{
                border: '0',
                padding: '0',
                fontSize: '14px',
                fontWeight: 'bold',
              }}
              type="icon-chalou0101"
            ></MyIcon>{' '}
            极客观点
          </span>
        </div>
        <div className="an_quest">
          <Button>提问题</Button>
        </div>
        <div className="an_content">
          <div className="an_row">
            <div className="an_row_num">
              <p>24</p>
              <p>投票</p>
            </div>
            <div className="an_row_num">
              <p>50</p>
              <p>回答</p>
            </div>
            <div className="an_row_num">
              <p>19</p>
              <p>阅读</p>
            </div>
            <div className="an_row_msg">
              <p>百度编译器UE中fileUrlPrefix怎么实现动态变化？</p>
              <p className="an_row_bottom">
                <span className="an_row_tag">
                  <Tag className="an_tag">ueditor</Tag>
                  <Tag className="an_tag">javascript</Tag>
                </span>
                <span className="an_rowTname">
                  <span style={{ color: '#00965e' }}>林小木 </span>· 2分钟前提问
                </span>
              </p>
            </div>
          </div>
          <div className="an_row">
            <div className="an_row_num">
              <p>0</p>
              <p>投票</p>
            </div>
            <div className="an_row_num">
              <p>33</p>
              <p>回答</p>
            </div>
            <div className="an_row_num">
              <p>9</p>
              <p>阅读</p>
            </div>
            <div className="an_row_msg">
              <p>百度编译器UE中fileUrlPrefix怎么实现动态变化？</p>
              <p className="an_row_bottom">
                <span className="an_row_tag">
                  <Tag className="an_tag">ueditor</Tag>
                  <Tag className="an_tag">javascript</Tag>
                </span>
                <span className="an_rowTname">
                  <span style={{ color: '#00965e' }}>林小木 </span>· 2分钟前提问
                </span>
              </p>
            </div>
          </div>
        </div>
      </div>
      <div className="an_right">
        <div className="rightText">
          <p>🔥 来做闯关达人，卷晕他们！</p>
        </div>
        <div className="rightOne">
          <div className="one_1">
            <h6>新手任务</h6>
            <span>完成所有任务可以获得勋章哟~</span>
          </div>
          <div className="one_2">
            <p>🔥 了解社区规则</p>
            <div>去看看</div>
          </div>
          <div className="one_3">
            <p>🔥 提出一个问题</p>
            <div>去看看</div>
          </div>
          <div className="one_3">
            <p>🔥 关注并绑定微信公众号</p>
            <div>去看看</div>
          </div>
          <div className="one_3">
            <p>🔥 回到一个你擅长的问题</p>
            {/* <div>去看看</div> */}
          </div>
        </div>
        <div className="rightTwo">
          <div className="two_1">
            <h4>关注标签</h4>
            <h4>管理</h4>
          </div>
        </div>
        <div className="rightThree"></div>
        <div className="rightFour"></div>
        <div className="rightFive"></div>
      </div>
    </div>
  );
});
